<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
<style>
span {
        /* font-variant: small-caps; */
        text-transform: uppercase;
    }
    a{
        text-decoration: none;
    }
    span.underline{
        text-decoration: underline;
    }

    span.overline {
	text-decoration: overline;
}
</style>
    
    ...
    
    <span>houdunren.com</span>
    <div>-</div> 


    <a href="">houdunren.com</a>
<hr>
<span class="underline">下划线</span>
<hr>
<span class="through">删除线</span>
<hr>
<span class="overline">上划线</span>


<style>
.s1{
    text-shadow: rgba(50, 50, 50, 0.5)  5px 5px 2px;
}
</style>

<span class="s1">阴影控制</span>

<br>
<br>
<br>
<br>
<style>
    h2 {
	white-space: nowrap;
	width: 100px;
	border: solid 1px #ccc;
}
</style>


<h2>hou        dunren     .com</h2>

<style>
    h3{
        width: 100px;
        border: 3px solid sliver;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
</style>

<h3>
    文本溢出ddddddddddddddddddddddddddddd
</h3>



</body>
</html>